<template>
  <div class="login-container">
    <el-form ref="form" :model="user" label-width="80px"
             status-icon
             label-position="left"
             class="demo-ruleForm login-page">
      <h3 class="title">系统登录</h3>
      <el-form-item label="登录名" prop="nickName">
        <el-input v-model="user.nickName"></el-input>
      </el-form-item>
      <el-form-item label="登录密码" prop="password">
        <!-- keyup要加上native限制符，因为element-ui把input进行了封装，原事件就不起作用了 -->
        <el-input type="password" v-model="user.password" @keyup.enter.native="login"></el-input>
      </el-form-item>
      <el-form-item>
        <el-button type="primary"  @click="login">立即登录</el-button>
        没有账号？
        <el-button type="text"  @click="toRegist">立即注册</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>
<script>
export default {
  name: 'UserLogin',
  data(){
    return{
      user:{
        nickName:'',
        password:''
      }
    }
  },

 /* methods:{
    toRegist(){
      this.$router.replace({path: '/regist'})
    },
    login(){
      if(window.sessionStorage.getItem('token')){
        this.$message('你已登录，请先退出')
        return
      }
      var fd = JSON.stringify(this.user);
      //console.log(fd)
      this.$axios.defaults.headers.post['Content-Type'] = 'application/json;charset=UTF-8'
      this.$axios.post('/user/login',fd).then(res =>{
        if(res.data.status === 200){
          this.$message(res.data.msg);
          console.log(res.data)
          //获取token并保存
          var userToken = 'User ' + res.data.data[0];
          // console.log(userToken)
          window.sessionStorage.setItem('token',userToken)
          //获取user保存，用json格式存，后边才好读
          var getu = JSON.stringify(res.data.data[1]) ;
          //var getu =res.data.data[1]
          console.log(getu)

          window.sessionStorage.setItem('getu',getu)
          this.$router.push('/')
        }else{
          this.$message(res.data.msg);
          this.$refs.form.resetFields();
          return
        }
      })
    }
  }*/
}
</script>
<style scoped>
.login-container {
  width: 100%;
  height: 100%;
}
.login-page {
  -webkit-border-radius: 5px;
  border-radius: 5px;
  margin: 180px auto;
  width: 350px;
  padding: 35px 35px 15px;
  background: #fff;
  border: 1px solid #eaeaea;
  box-shadow: 0 0 25px #cac6c6;
}
label.el-checkbox.rememberme {
  margin: 0px 0px 15px;
  text-align: left;
}
</style>
